<template>
  <div>
    仓库<el-select style="width: 140px;margin-left: 10px;margin-right: 10px;" size="small" placeholder="仓库"></el-select>
    商品名称<el-input style="width: 140px;margin-left: 10px; margin-right: 10px;" size="small"
      placeholder="商品名称"></el-input>
    <el-button size="small" type="primary">查询</el-button>
    <el-table :data="pageInfo.list" style="width: 100%;margin-top: 10px;" height="400"
      @selection-change="handleSelection">
      <el-table-column type="selection" width="55">
      </el-table-column>
      <el-table-column prop="imagename" label="图片" width="120">
      </el-table-column>
      <el-table-column prop="goodcode" label="商品编号" width="120">
      </el-table-column>
      <el-table-column prop="brandName" label="品牌" width="120">
      </el-table-column>
      <el-table-column prop="origin" label="产地" width="120">
      </el-table-column>
      <el-table-column prop="goodname" label="商品名称" width="150">
      </el-table-column>
      <el-table-column prop="categoryName" label="商品类别" width="120">
      </el-table-column>
      <!-- <el-table-column prop="zip" label="属性" width="120">
      </el-table-column> -->
      <el-table-column prop="unitname" label="单位" width="120">
        <!-- <template slot-scope="scope">
          <span v-for="(unit, index) in unitList" :key="index">
            <span v-if="unit.id == scope.row.unitid">{{ unit.unidname }}</span>
          </span>
        </template> -->
      </el-table-column>
      <el-table-column prop="unitid" label="库存基本数量" width="120">
      </el-table-column>
      <!-- <el-table-column prop="zip" label="录入数量" width="120">
      </el-table-column> -->
    </el-table>
    <el-pagination style="position: relative;left: 30px;" @current-change="handleCurrentChange"
      :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" layout="total, sizes, prev, pager, next, jumper"
      :total="pageInfo.total">
    </el-pagination>
  </div>
</template>

<script>
export default {
  props: ['goodsShow'],
  watch: {
    goodsShow(newVal, oldVal) {
      if (oldVal == false) {
        this.getGoodsPage(1, 10)
      }
    }
  },
  data() {
    return {
      selectionList: [],
      pageInfo: {},
      unitList: [],
      goodsList: []
    }
  },
  methods: {
    handleSelection(val) {
      this.selectionList = val.map(row => {
        // 返回你需要的属性
        return {
          // imagename: row.imagename,
          goodcode: row.goodcode,
          brandName: row.brandName,
          origin: row.origin,
          goodname: row.goodname,
          categoryName: row.categoryName,
          unitname: row.unitname,
          wId: '',
          ibDetailId: '',
          inBoundId: '',
          unitPrice: '',
          num: '',
          wholeBag: '',
          isEdit: false
        };
      });
    },
    handleCurrentChange(val) {
      this.getGoodsPage(val, 10)
    },
    getGoodsPage(pageNum, pageSize) {
      this.axios.get('/erp/goods/goods/getList',
        {
          params: {
            pageNum, pageSize
          }
        }
      ).then(rs => {
        this.pageInfo = rs.data.pageInfo
        this.goodsList = rs.data.pageInfo.list
        this.getUnitList()
        // console.log(this.pageInfo)
      })
    },
    //获取基本单位
    getUnitList() {
<<<<<<< HEAD
      this.axios.get('erp/goods/basicUnit/getList').then(rs => {
=======
      this.axios.get('/erp/goods/basicUnit/getList').then(rs => {
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
        this.unitList = rs.data.list
        this.pageInfo.list.forEach((goods, index) => {
          // console.log(this.unitList)
          this.unitList.forEach((unit, index) => {
            if (goods.unitid == unit.id) {
              this.$set(goods, 'unitname', unit.unidname);
            }
          })

        })
      })
    }
  },
  created() {
    this.getGoodsPage(1, 10)
  }
}
</script>

<style scoped>
/* 合计行整体样式修改开始 */
.el-table /deep/ .el-table__footer-wrapper tbody td {
  background-color: #fff1d4;
}

.el-table /deep/ .el-table__body tr:hover>td {
  background-color: #fff1d4;
}
</style>